
var activityStore;
var opportunityStore;

function createReportPanel(){
	
		activityStore = CRM.commons.createStore('activityReportStoreId', CRM.SPComp.activityDataArray, 'activityreports/showActivitiesDynamically');
        opportunityStore = CRM.commons.createStore('opportunityReportStoreId', CRM.SPComp.opportunityDataArray, 'opportunityreports/showOpportunityDynamically');
        
        	var mainDesignPanel ={
        			xtype		: 'panel',
        			id			: 'mainDesignPanel',
        			autoHeight	: true,
        			autoWidth	: true,
        			items		: [],
                   	tbar    	: {
    		                          xtype       : 'toolbar',
    		                          buttonAlign : 'left',
    		                          items       : [
    												 {
    												  xtype   	  	: 'button',
    												  id		  	: 'activityReportButton',
    												  text    	  	: 'Activity Report',
    												  enableToggle	: true,
    												  toggleGroup 	: 'menu',
    												  toggleHandler	: function(){
    												    			 	addActivityReport();
    												    			  }
    												 },
    												 '-',
    		                                         {
    		                                          xtype   		: 'button',
    		                                          id			: 'opportunityReportButton',
    		                                          text    		: 'Opportunity Report',
    		                                          enableToggle	: true,
    		                                          toggleGroup   : 'menu',
    		                                          toggleHandler	:  function(){
    		                                        	  			   	 addOpportunityReport();	
    		                                          				   }
    		                                         }
    		                                      ]
                			}     
        	};
        
            var reportMainPanel = new Ext.FormPanel({
                id          : 'reportMainPanel',
                height      : 680,
                width       : 1085,
                frame       : false,
                layout      : 'vbox',
                items       : [
								//CRM.SPComp.createHeader(0,7),
								mainDesignPanel
                			  ]           			  
            });
            
            return reportMainPanel;
	}            

            function showPeriod(){
          		var formPanel = Ext.getCmp('reportMainPanel');
        	    var periodValue = Ext.getCmp('searchPeriodType').getValue();
        	    Ext.Ajax.request({
          		   url		: 'activityreports/showPeriodDate?periodCriteria='+periodValue,
          		   method	: 'GET',
          		   success	: function(result){
          			  			var jsonData = Ext.util.JSON.decode(result.responseText);
          			  			var resFromDate = jsonData.data.fromDate;
          			  			var resToDate = jsonData.data.toDate;
          			  			
          			  			Ext.getCmp('fromDate').setValue(resFromDate);
          			  			Ext.getCmp('toDate').setValue(resToDate);
          			   		  },
          		   failure 	: function(){
          			   			alert("failure");
          			   			formPanel.el.unmask();
          			   		  }
          	   });  		
          	} 
            
            function addActivityReport(){
            	var designPanel = Ext.getCmp('mainDesignPanel');
            	designPanel.removeAll();
            	designPanel.add(CRM.SPComp.createActivityDynamicSearch('gridId', activityStore, CRM.SPComp.createActivityColumnModel()));
            	designPanel.doLayout(true, true);
            };
            
			function addOpportunityReport(){
            	var designPanel = Ext.getCmp('mainDesignPanel');
            	designPanel.removeAll();
            	designPanel.add(CRM.SPComp.createOpportunityDynamicSearch('opportunityGrid', opportunityStore, CRM.SPComp.createOpportunityColumnModel()));
            	designPanel.doLayout(true, true);
            };

			function showMessage(){
	   			 Ext.MessageBox.show({
	         	            title: 'Confirm',
	         	            msg: 'Are you sure you want to delete this records:',
	         	            width:200,
	         	            buttons: Ext.MessageBox.OKCANCEL,
	         	            multiline: false,
	         	            fn: function(btn, text) {
	         	            	if (btn == 'ok') {
	         	            		deleteDetails();
	         	            	   }
	         	            	}
	         	           });
	   		};